import React from 'react';
import QueueAnim from 'rc-queue-anim';
import TweenOne from 'rc-tween-one';
import { Row, Col } from 'antd';
import OverPack from 'rc-scroll-anim/lib/ScrollOverPack';
import { getChildrenToRender } from './utils';
import { Parallax } from 'rc-scroll-anim';
type P = {
  id: string
}

class Content3 extends React.PureComponent<P> {
  constructor(prop: P) {
    super(prop)
  }
  render() {
    return (
      <div id={this.props.id} className="container-fluid" >
        <div className="row">
          <div className="col">
            <div className="container-xxl heada1">
              <div className="row">
                <div className="col heada1-h">
                  推动人才培养走向新阶梯
                </div>
              </div>
              <div className="row">
                <div className="col heada1-s">
                  Promote Talent Training To A New Level
                </div>
              </div>
              <div className="row">
                <div className="col heada1-t">
                  “基地”+“校”联合培养---&gt;培养模式走向成熟
                </div>
              </div>
            </div>
          </div>
        </div>
        <div className="row">
          <div className="col-4 left p-0 m-0">
            <Parallax
              always={false}
              animation={{ x: 0, opacity: 1, playScale: [0.3, 0.35], }}
              style={{ transform: 'translateX(-40%)', opacity: 0 }}
              className="code-box-shape"
            >
              <img src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/JOY/guanwang/chart_left.png" alt="" />
            </Parallax>
          </div>
          <div className="col-4 p-0 m-0 text-center">
            <Parallax
              always={false}
              animation={{
                scale: 1.1,
                duration: 2000,
                rotate: 0,
                opacity: 1,
                playScale: [0.3, 0.35],
              }}
              style={{ transform: 'scale(0.1)', opacity: 0 }}
              className="code-box-shape"
            >
              <img className="rounded-circle imgc3" src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/JOY/guanwang/chart_center_1.png" alt="" />
            </Parallax>
          </div>
          <div className="col-4 right p-0 m-0">
            <Parallax
              always={false}
              animation={{ x: 0, opacity: 1, playScale: [0.3, 0.35], }}
              style={{ transform: 'translateX(40%)', opacity: 0 }}
              className="code-box-shape"
            >
              <img src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/JOY/guanwang/chart_right.png" alt="" />
            </Parallax>
          </div>
        </div>
      </div>
    );
  }
}

export default Content3;
